
import React from 'react';
import LifeCycle from './LifeCycle';
import { Button } from 'antd';
// import 'antd/dist/antd.css'

import './index.less';

export default class Left extends React.Component {
  constructor (props) {
    super(props);

    this.state = {
      count: 0
    }
  }

  handlerAdd = () => {
    console.log('handlerAdd: ', this);
    this.setState({
      count: this.state.count + 1
    })
  };

  handlerAdd2 () {
    console.log('handlerAdd2: ', this);
    this.setState({
      count: this.state.count + 1
    })
  };

  render () {
    let style = {
      padding: '10px',
      background: 'yellowgreen',
    };
    return (
      <div className='container'>
        <p style={style}>React 生命周期函数</p>
        <Button onClick={this.handlerAdd}>AntD：点击一下吧</Button>
        <button onClick={this.handlerAdd2.bind(this)}>点击一下</button>

        <LifeCycle name={ 'name: ' + this.state.count }>{ 'ha' }</LifeCycle>
      </div>
    )
  }
}
